<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">

    <title>极思创想·云旗IOS版 扫描设备</title>
    <meta name="keywords" content="极思创想">
    <meta name="description" content="云旗">

    <link href="css/bootstrap.min.css?v=3.4.0" rel="stylesheet">
    <link href="css/font-awesome.min.css?v=4.3.0" rel="stylesheet">

    <link href="css/animate.min.css" rel="stylesheet">
    <link href="css/style.min.css?v=3.0.0" rel="stylesheet">

</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-md-6">
                <div class="panel panel-primary" style="height: 105px;">
                    <div class="panel-heading">
                        扫描设置
                    </div>
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-md-5">
                                <input type="email" id="startip" placeholder="输入起始IP 例如:192.168.1.1" class="form-control">
                            </div>
                            <div class="col-md-5">
                                <input type="email" id="endip" placeholder="输入结束IP 例如:192.168.1.255" class="form-control">
                            </div>
                            <div class="col-md-2">
                                <button class="btn btn-sm btn-primary" id="scan" type="submit"><strong>开  始  扫  描</strong></button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-6">
                <div class="panel panel-primary" style="height: 105px;">
                    <div class="panel-heading">
                        扫描注意事项
                    </div>
                    <div class="panel-body" style="padding-top: 7px;">
                        <p>扫描结束前不要关闭本页面</p>
                        <p>每次扫描只能扫描一个网段 请在输入时确认</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>扫描设备</h5>
                <div class="ibox-tools">
                    <a class="collapse-link">
                        <i class="fa fa-chevron-up"></i>
                    </a>
                    <a class="dropdown-toggle" data-toggle="dropdown" href="typography.html#" aria-expanded="false">
                        <i class="fa fa-wrench"></i>
                    </a>
                    <a class="close-link">
                        <i class="fa fa-times"></i>
                    </a>
                </div>
            </div>
            <div class="ibox-content">
                   <div class="row">
                    <div class="col-sm-6">
                        <div class="ibox">
                            <div class="ibox-content">
                                <h5>扫描进度</h5>
                                <h2><sapn id="progress">0</sapn>/<span id="devicesum">0</span></h2>
                                <div class="text-center">
                                    <div id="sparkline5"></div>
                                </div>
                            </div>
                             </div>
                       </div>
                       <div class="col-sm-6">
                        <div class="ibox">
                            <div class="ibox-content">
                                <h5>扫描日志</h5>
                                <div class="text-left log_class" id="scan_log">
                                    
                                </div>
                            </div>
                             </div>
                       </div>
             </div>
            </div>
        </div>
        <style type="text/css">
            .log_class{
                height: 550px;
                border: 3px rgb(213, 213, 213) solid;
                padding: 10px;
                border-style: dashed;
                font-size: 22px;
                background-color: #000;
                color: rgb(9, 255, 49);
                overflow-x: hidden;
                overflow-y: scroll;
            }
        </style>
    </div>
    <!-- 全局js -->
    <script src="js/jquery-2.1.1.min.js"></script>
    <!-- Sparkline -->
    <script src="js/plugins/sparkline/jquery.sparkline.min.js"></script>
    <!-- 弹出js -->
    <script src="../layer/layer.js"></script>
    
    <script src="js/device_scan.js"></script>

    <script>
    init1(); // 初始化饼形图
    function init1(){
        $("#sparkline5").sparkline([1], {
            type: "pie",
            height: "480",
            sliceColors: ["#888888"]
        });
    }
    </script>
</body>

</html>